<template>
  <div class="con-userbody">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="发布求助" name="first">
        <postHelp></postHelp>
      </el-tab-pane>
      <el-tab-pane label="参与求助" name="second">
        <partInHelp></partInHelp>
      </el-tab-pane>
      <el-tab-pane label="参与志愿活动" name="third">
        <volunteerActivity></volunteerActivity>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import partInHelp from './partInHelp.vue'
import postHelp from './postHelp.vue'
import volunteerActivity from './volunteerActivity.vue'
export default {
  components: { partInHelp, postHelp, volunteerActivity },
  data() {
    return {
      activeName: 'first',
    }
  },
  methods: {
    handleClick(tab, event) {
      // console.log(tab)
    },
    selectOption(data) {
      // console.log(data)
    },
  },
}
</script>

<style lang="less" scoped>
/deep/.el-tabs__nav {
  display: flex;
  width: 100%;
  .el-tabs__item,
  .is-top {
    flex: 1;
    text-align: center;
  }
}
</style>
